.self-checking-container {
    width: 100%;
    height: 100%; 
    padding: 16px 16px 0 16px;
    box-sizing: border-box;
    overflow-y: auto;
    position: fixed; 
    background: url(../img/bg.png) no-repeat 0 0;
    background-size: cover;}
    .self-checking-container .self-checking-head {
        font-size:14px;
        font-weight:400;
        color:rgba(255,255,255,1);
        position: relative; }
        .self-checking-container .self-checking-pre {
            position: absolute;
            top: 50%;            
            transform: translateY(-50%);}
        .self-checking-container .self-checking-head .self-checking-num {
            padding: 0 36px;
            text-align: center;
            line-height:25px; }
    .self-checking-container .self-checking-con {
        width: 100%;
        height: 90%;
        margin-top: 10px;
        /* margin-right: 16px; */
        background: #fff;
        border-radius: 5px; 
        box-sizing: border-box;
        overflow: hidden;
        /* position: absolute; */
     }
        .self-checking-container .self-checking-con .subject-num {
            font-size:28px;
            font-weight:400;
            color:rgba(72,72,72,1);
            line-height:40px; 
            padding-top: 20px;
            text-indent: 15px; }
            .self-checking-container .self-checking-con .subject-con {
                font-size:28px;
                height: 200px;
                font-weight:400;
                color:rgba(72,72,72,1);
                line-height:40px;
                padding: 0 30px;
                overflow:hidden; 
                text-overflow:ellipsis;                    
                display:-webkit-box; 
                -webkit-box-orient:vertical;      
                -webkit-line-clamp:5; }
                .self-checking-container .self-checking-con .subject-titles {
                    margin-top: 30px; }
                .self-checking-container .self-checking-con .subject-title {
                    height: 50px;
                    /* background: #E3E3E3; */
                    font-size:14px;
                    font-weight:400;
                    color:rgba(72,72,72,1);
                    line-height:50px;
                    text-align: center;
                    padding: 0 48px;
                    border-radius: 5px;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 1;
                    overflow: hidden; }
    

    .self-floor {
        height: 260px;
    }
    .item-floor {
        height: 260px;
        position: absolute;
        background: #fff;
        margin-right: 16px;
        border-radius: 5px;
    }
    .first-floor {
        z-index: 10 }
    .second-floor {
        z-index: 9 }

    .droptop {
        
        animation: droptop 2s ease-in-out forwards;}
    
    @keyframes droptop {
        0% {
            max-width: 100%;
            top: 0%;
            right: 0%;
            transform: scale(0.9) rotate(0deg)}
        /* 10% {
            top: -20px;
            right: -20px;
            transform: scale(0.9) rotate(5deg)} */
        /* 30% {width: 300px;
            top: -40px;
            right: -40px;
            transform: scale(0.9) rotate(10deg)} */
        /* 40% {width: 300px;
            top: -120px;
            right: -120px;
            transform: rotate(20deg)}
        60% {width: 300px;
            top: -150px;
            right: -150px;
            transform: rotate(30deg)}
        80% {width: 300px;
            top: -170px;
            right: -170px;
            transform: rotate(40deg)} */
        100% {width: 300px;
            top: -110%;
            right: -200%;
            transform: scale(0.2) rotate(50deg)}
    }